<template>
  <div class="deposit_details">
    <el-container class="base_details_container">
      <BackTitleView :title=title />
      <el-main>
        <div class="base_details_content">
          <div class="content" style="margin-top: 20px">
            <DataCollectTable :data="data" :total="total" :config="config">
            </DataCollectTable>
          </div>
        </div>
      </el-main>
      <el-footer>
        <el-button @click="back">关闭</el-button>
      </el-footer>
    </el-container>
  </div>
</template>

<script setup>
import { ref, reactive } from "vue";
import BackTitleView from "@com/BackTitleView.vue";
import $ from "@util/base";
import useRoute from "@util/router";
import api from "@api/deposit";

const route = useRoute();

route.watchRouter("deposittabledetails", () => {
  getList();
});

var title = '储值完整记录'
init()
function init() {
  if (route.query().type === '1048001') {
    title = '储值完整记录'
  } else {
    title = '冻结完整记录'
  }
}

const data = ref([]);
const total = ref(0);

const config = {
  showIndex: true,
  column: [
    {
      label: "变更事项",
      prop: "changeType",
    },
    {
      label: "订单号",
      prop: "changeInfo",
    },
    {
      label: "变更时间",
      prop: "createTime",
    },
    {
      label: "储值变更",
      prop: "changeMoney",
    },
    {
      label: "余额",
      prop: "balanceMoney",
    }
  ],
};

getList();
function getList() {
  let routeQuery = route.query();
  api.list(
    {
      depositType: routeQuery.type,
      memberCode: routeQuery.code,
      page: routeQuery.p,
      size: routeQuery.s,
    },
    (val) => {
      total.value = val.total;
      data.value = val.list.map((e) => {
        if (e.changeMoney > 0) {
          e.changeMoney = `+${e.changeMoney}`;
        }
        return e;
      });
    }
  );
}

function back() {
  route.go(-1);
}
</script>

<style lang="scss">
.deposit_details {
  height: 100%;
}
</style>
